import React from 'react';
import './category.less'

interface Props {
   goodsList: GoodsItem[]
}
interface GoodsItem {
    goodsImage: string;
    goodsTitle: string;
}

const Category: React.FC<Props> = ({ goodsList }) => {
    const goodsItem = goodsList.map((item: GoodsItem) =>
        <div className="category-item">
            <div className="card">
                <div className="card-body">
                    <h6>{item.goodsTitle}</h6>
                    <img src={item.goodsImage} alt="商品图"/>
                </div>
            </div>
        </div>
    )
    return (
        <div className="category">
            {goodsItem}
        </div>
    );
};

export default Category;
